<template>
	<el-dialog title="提示" class="details" :modal-append-to-body="false" :visible.sync="detailsVisible" width="360px">
		<div class="details-item">
			<span class="details-item-title">文件标题</span>
			<span class="details-item-content">{{folderForm.name}}</span>
		</div>
		<div class="details-item">
			<span class="details-item-title">文件类型</span>
			<span class="details-item-content">{{folderForm.docType | docType}}</span>
		</div>
		<div class="details-item">
			<span class="details-item-title">创建者</span>
			<span class="details-item-neme">{{folderForm.createBy}}</span>
		</div>
		<div class="details-item">
			<span class="details-item-title">创建时间</span>
			<span class="details-item-content">{{folderForm.createTime}}</span>
		</div>
		<div class="details-item">
			<span class="details-item-title">文档描述</span>
			<span class="details-item-content">{{folderForm.content}}</span>
		</div>
		<!-- <div class="details-item">
			<span class="details-item-title">文档附件</span>
			<div v-for="item in folderForm.docFilePath" >
				<el-tooltip class="item" effect="dark" content="点击查看" placement="top">
     		 	<div class="documentClick_item" @click="documentClick(item)">{{item.fileName}}</div>
    			</el-tooltip>
			</div>
		</div> -->
	</el-dialog>
</template>

<script>
	import {queryById} from '@/api/doc.js'
	export default{
		data(){
			return{
				detailsVisible: false,
				folderForm: {}
			}
		},
		props: {
			treeData: {
				type: Object,
				default: null
			},
		},
		filters:{
			docType(data){
				if(data == '00'){
					return '项目附件'
				}else if(data == '01'){
					return '任务附件'
				}else if(data == '02'){
					return '产品文档'
				}else if(data == '04'){
					return '企业文档'
				}else if(data == '05'){
					return '合同文档'
				}else if(data == '06'){
					return '知识库'
				}
			}
		},
		methods:{
			documentClick(item){
				console.log(item);
				// window.open(item.fileUrl, '_blank') //url为访问的地址
			},	
			loadDetails() {
				this.detailsVisible = true
				this.loadQuery()
			},
			// 查看文档详情
			loadQuery(){
				var _this = this
				queryById({id:_this.treeData.docId}).then(res=>{
					console.log(res)
					_this.folderForm = res.data
				})
			},
		}
	}
</script>

<style scoped>

	.details-item{
		margin-bottom: 14px;
		display: flex;
		flex-direction: column;
	}

	.details-item-title{
		color: #909aaa;
		font-size: 14px;
	}

	.details-item-content{
		color: #2e405e;
		font-size: 14px;
		margin-top: 4px;
	}

	.details-item-neme{
		color: #2c7ef8;
		font-size: 14px;
		margin-top: 4px;
	}

	/deep/.el-dialog .el-dialog__footer {
		border-color: white;
	}

	/deep/.el-dialog__title {
		font-weight: bold;
		font-size: 16px;
	}
	.documentClick_item{
		margin-bottom: 10px;
		cursor: pointer;
	}
</style>
